<template>
  <div>
    <!-- 暂时表现弹出窗口效果 -->
    <van-dialog
      :value="value"
      @input="$emit(`input`,$event)"
      :showConfirmButton="false"
      closeOnClickOverlay
      @closed="isOneLevel=true"
    >
      <van-cell-group v-if="isOneLevel">
        <!-- 一级菜单 -->
        <van-cell title="不感兴趣" icon="location-o" @click="articleDislike()"></van-cell>
        <van-cell title="反馈垃圾内容" icon="location-o" is-link @click="isOneLevel=false"></van-cell>
        <van-cell title="拉黑作者" icon="location-o"></van-cell>
      </van-cell-group>
      <van-cell-group v-else>
        <!-- 二级菜单 -->
        <van-cell icon="arrow-left" @click="isOneLevel=true" />
        <van-cell
          v-for="item in reportList"
          :key="item.value"
          :title="item.title"
          @click="articleReport(item.value)"
          icon="location-o"
        ></van-cell>
      </van-cell-group>
    </van-dialog>
  </div>
</template>

<script>
// 文章不感兴趣的api函数
import { apiArticleDislike, apiArticleReport } from "@/api/article.js";
export default {
  name: "more-action",
  props: {
    value: {
      type: Boolean,
      default: false
    },
    articleID: {
      type: String,
      required: true
    }
  },
  data() {
    return {
      // 文章举报类型明细
      reportList: [
        { title: "其他问题", value: 0 },
        { title: "标题夸张", value: 1 },
        { title: "低俗色情", value: 2 },
        { title: "错别字多", value: 3 },
        { title: "旧闻重复", value: 4 },
        { title: "广告软文", value: 5 },
        { title: "内容不实", value: 6 },
        { title: "涉嫌违法犯罪", value: 7 },
        { title: "侵权", value: 8 }
      ],
      isOneLevel: true // 控制一级。二级信息明细显示
    };
  },
  methods: {
    // 文章举报处理
    async articleReport (type) {
      try {
        const args = { articleID:this.articleID, type }
        await apiArticleReport(args)
      } catch (err) {
        if (err.response.status === 409) {
          return this.$toast.fail('文章已经被举报了')
        }
      }
      // 提示成功
      this.$toast.success('文章举报成功')
      // 关闭弹出框
      this.$emit('input', false)
    },
    // 文章不感兴趣处理
    async articleDislike() {
      // 调用api
      // 当前处理，正常情况成功100%
      await apiArticleDislike(this.articleID);

      this.$toast.success("处理成功");
      // 关闭弹出框,修改父组件的showDialog的值为false，进而影响子组件关闭弹框
      this.$emit("input", false);

      // 调用自己的事情，使得父子组件页面文章清除
      this.$emit("dislikeSuccess");
    }
  }
};
</script>

<style scoped lang='less'>
</style>